import Vue from 'vue'
import VueRouter from 'vue-router'
// 引入login页面
import Login from '../components/Login.vue'
// 引入Home页面
import Home from '../components/Home.vue'

Vue.use(VueRouter)

const routes = [
  // redirect 重定向页面
  { path: '/', redirect: '/login' },
  { path: '/login', component: Login },
  { path: '/home', component: Home },
]

const router = new VueRouter({
  routes
})

// 使用路由导航 设置网页跳转 让客户只能通过登录页面访问hone页面 无法直接访问页面
// 路由导航和axios请求拦截的区别
// 路由导航 是阻止浏览器页面的跳转
// axios是拦截的请求 
router.beforeEach((to, from, next) => {
  // 如果去的页面就是登录页 直接放行 终止函数
    if(to.path==='/login') return next()

  // 如果访问的不是login页面 先判断登录后保存的token值 
  const tokenStr = window.sessionStorage.getItem('token')
  // 如果tokenStr是空的话 则强制跳转到登录页面
  if(!tokenStr) return next('/login')
  // 如果tokenStr有值的话 就直接跳转到登录后的页面
  next()
})

export default router
